<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui"
	template="/template/templatePadrao.xhtml">

	<h:head>
		<style type="text/css">
.value {
	width: 800px;
}
</style>

		<script type="text/javascript">
			PrimeFaces.locales['tr'] = {
				closeText : 'kapat',
				prevText : 'geri',
				nextText : 'ileri',
				currentText : 'bugün',
				monthNames : [ 'Ocak', 'Şubat', 'Mart', 'Nisan', 'Mayıs',
						'Haziran', 'Temmuz', 'Ağustos', 'Eylül', 'Ekim',
						'Kasım', 'Aralık' ],
				monthNamesShort : [ 'Oca', 'Şub', 'Mar', 'Nis', 'May', 'Haz',
						'Tem', 'Ağu', 'Eyl', 'Eki', 'Kas', 'Ara' ],
				dayNames : [ 'Pazar', 'Pazartesi', 'Salı', 'Çarşamba',
						'Perşembe', 'Cuma', 'Cumartesi' ],
				dayNamesShort : [ 'Pz', 'Pt', 'Sa', 'Ça', 'Pe', 'Cu', 'Ct' ],
				dayNamesMin : [ 'Pz', 'Pt', 'Sa', 'Ça', 'Pe', 'Cu', 'Ct' ],
				weekHeader : 'Hf',
				firstDay : 1,
				isRTL : false,
				showMonthAfterYear : false,
				yearSuffix : '',
				month : 'Ay',
				week : 'Hafta',
				day : 'Gün',
				allDayText : 'Tüm Gün'
			};
		</script>
	</h:head>

	<ui:define name="body">
		<div id="central" align="center">
			<div class="cabecalho">
				<h1>
					<h:outputText value="SISTEMA DE RESERVAS" />
				</h1>
			</div>
		</div>
		<div class="padding">
			<h:form id="formInicio">

				<center>
					<p:growl id="messages" showDetail="true" />

					<h:panelGrid columnClasses="value">
						<h3 style="margin-top: 0">Editable Schedule</h3>
						<p:schedule id="schedule" value="#{scheduleView.eventModel}"
							widgetVar="myschedule" timeZone="GMT+2">

							<p:ajax event="dateSelect"
								listener="#{scheduleView.onDateSelect}" update="eventDetails"
								oncomplete="PF('eventDialog').show();" />
							<p:ajax event="eventSelect"
								listener="#{scheduleView.onEventSelect}" update="eventDetails"
								oncomplete="PF('eventDialog').show();" />
							<p:ajax event="eventMove" listener="#{scheduleView.onEventMove}"
								update="messages" />
							<p:ajax event="eventResize"
								listener="#{scheduleView.onEventResize}" update="messages" />
						</p:schedule>
					</h:panelGrid>

					<p:dialog widgetVar="eventDialog" header="Event Details"
						showEffect="clip" hideEffect="clip">
						<h:panelGrid id="eventDetails" columns="2">
							<h:outputLabel for="title" value="Title:" />
							<p:inputText id="title" value="#{scheduleView.event.title}"
								required="true" />

							<h:outputLabel for="from" value="From:" />
							<p:inputMask id="from" value="#{scheduleView.event.startDate}"
								mask="99/99/9999">
								<f:convertDateTime pattern="dd/MM/yyyy" timeZone="GMT+2" />
							</p:inputMask>

							<h:outputLabel for="to" value="To:" />
							<p:inputMask id="to" value="#{scheduleView.event.endDate}"
								mask="99/99/9999">
								<f:convertDateTime pattern="dd/MM/yyyy" timeZone="GMT+2" />
							</p:inputMask>

							<h:outputLabel for="allDay" value="All Day:" />
							<h:selectBooleanCheckbox id="allDay"
								value="#{scheduleView.event.allDay}" />

							<p:commandButton type="reset" value="Reset" />
							<p:commandButton id="addButton" value="Save"
								actionListener="#{scheduleView.addEvent}"
								oncomplete="PF('myschedule').update();PF('eventDialog').hide();" />
						</h:panelGrid>
					</p:dialog>
				</center>

			</h:form>

		</div>

	</ui:define>

</ui:composition>